<!DOCTYPE html>
<html lang="en">
<head>
    <meta charset="UTF-8">
    <title>ajax技术</title>
    <script src="./jquery1.11.3.js"></script>
    <script>
        $(function () {
            $('form input[type=button]').click(function () {
                // $.ajax({
                //     type:'POST' ,
                //     url:'25.test123333.php',
                //     data:{
                //         user:$('form input[name=user]').val()
                //     },
                //     success:function (response) {
                //         $('#box').html(response);
                //     },
                //     timeout:500,
                //     error:function (xhr,errorText,errorType) {
                //         // alert(xhr);//[object Object]
                //         // alert(errorText);//error
                //         // alert(errorType);//Not Found
                //         alert(xhr.status+":"+xhr.statusText);//404:Not Found
                //     }
                // });
                $.post('25.test.php').error(function (xhr,errorText,errorType) {
                    // alert(xhr.status+":"+xhr.statusText);
                });
                $.post('25.test.php')
                    .success(function () {
                        alert("成功调用");
                        })
                .error(function () {
                    alert("error");
                })
            });
//捕获全局的异常
            $(document).ajaxError(function (event,xhr,settings,info) {
                // alert(settings.url+":"+settings.type);//常用的
                //返回值 25.test125555.php:POST:Not Found
                alert(settings.url+":"+settings.type+":"+info+":"+xhr.status);
            });
            $(document).ajaxStart(function () {
                $('.loading').show();//展示
            });
            $(document).ajaxStop(function () {
                $('.loading').hide();//隐藏
            });
            $(document)
                .ajaxSend(function () {
                alert("发送请求之前执行");
            })
            .ajaxComplete(function () {
                alert('请求完成之后 不管成功失败与否');
            })
            .ajaxSuccess(function () {
                alert("请求成功");
            });
        })
    </script>
</head>
<body>
    <form action="">
        用户名:<input type="text" name="user">
        <input type="button" value="提交">
        <input type="radio" name="sex" value="男">男
        <input type="radio" name="sex" value="女">女
    </form>
    <span class ="loading" style="color: red;display: none" >正在加载中.....</span>
    <div id="box"></div>
<script>
    /*1.加载请求
    2.错误处理
        ajaxStart()方法 ajax开始执行的时候 展示内容
        ajaxStop()方法 ajax结束的时候 隐藏内容
        捕获全局的异常 $(document).ajaxError();
        ajaxSend() 发送请求之前
        ajaxComplete()  请求完成之后
        ajaxSuccess() 请求是否成功


    * */
</script>
</body>
</html>